Comprehensive Warning Visualization for JIT-unfriendly Code in JavaScript

JavaScript has become one of the most popular programming languages. It powers various popular websites and has become the de facto web assembly language. The efficiency of the JavaScript engines become crucial to the success of most web applications. Most modern JavaScript engines use just-in-time (JIT) compilation to translate parts of JavaScript code into efficient machine code at runtime. Despite the overall success of JIT compilers, programmers may still write code that uses the dynamic features of JavaScript in a way that prohibits profitable optimizations. Previously, there was no way to measure how prevalent such JIT-unfriendly code is and to help developers detect such code locations. We have proposed a tool called JITProf [14], a profiling framework to dynamically identify code locations that prohibit profitable JIT optimizations. The key idea is to associate meta-information with JavaScript objects and code locations, to update this information whenever particular runtime events occur, and to use the meta-information to identify JIT-unfriendly operations. The tool has gotten attention from both academia and industry. More specifically, this tool inspired Mozilla Research to develop an equivalent tool called JIT-Coach [2, 20]. The tool was specifically designed for their SpiderMonkey JavaScript engine that is used in Firefox Browser. Recently, Intel has also contacted us and showing interest in our tool. However, all of these existing state-of-the-art JIT-unfriendly code detection tools simply dump a list of warnings with their line numbers. The warning message contains the warning type, source location and some structured information that is specific to the type of problems detected by JITProf. Normally to show the whole problem, a single warning can contain dozens of lines of text (see a live demo in [3]) or even hundreds of lines of text in the console. This makes debugging based on the warning message tedious and less productive. To make the problem even worth, normally our tool will analyze the runtime pattern of an entire website which may consist of tens of thousands of lines of JavaScript code. This normally leads to the generation of hundreds of warnings. There is currently no way to get an overview of all those warnings. In this project, we propose to implement a special visualization tool to show warnings generated by dynamic analysis tool such as JITProf. Our framework is built on top of the Jalangi framework and provide a comprehensive visualization that consists of an overview of statistics of all warnings generated by the dynamic analysis tool, a group of customized visualization schema for each specific type of warnings, and an interface to easily associate runtime data with the corresponding source code. To my best knowledge, there is no existing work for visualizing JIT-unfriendly code in a large code base. The goal is to visualize the JIT-unfriendly code detected by JITProf and hopefully to make the debugging process productive and delightful. Instead of reading possibly hundreds of lines of text in the console, the potential users of our visualization system should get a quick overview of what kind of problems are there in their source code and which problem is most severe. The visualization system should also provide easy to comprehend details when the user is interested in looking for more runtime information when debugging.